<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="utf-8">
    <title>admin</title>
    <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />

    <link rel="stylesheet" type="text/css" th:href="@{/admin/css/page.css}" />
    <link rel="stylesheet" type="text/css" th:href="@{/admin/bootstrap4/css/bootstrap.min.css}">
    <link th:href="@{/admin/plugins/css/icons.min.css}" rel="stylesheet" type="text/css" />

</head>
<body>
<div class="page" id="app">
    <div class="nav-left">
        <div class="LogoName">
            管理员：[[${session.admin.adminRelname}]]
        </div>
        <div class="navDiv">
            <div class="navName">导航</div>
            <div class="nav-list">
                <ul>
                    <li class="nav-tab a_active waves-effect">
                        <a th:href="@{/admin/adminIndex}" class="li-a active" target="iframe"><i class='bx bx-home-smile'></i> 后台主页
                        </a>
                    </li>
                    <li class="nav-tab nav-ul">
                        <a href="javascript:void[0]" class="li-a"><i class='bx bx-layer'></i> 后台管理
                            <i class='bx bx-chevron-right' style="float: right;"></i></a>
                        <div class="nav-box">
                            <a th:href="@{/admin/userList(currentIndex=1)}" class="li-a-a" target="iframe">用户管理</a>
                            <a th:href="@{/admin/checkArticle}" class="li-a-a" target="iframe">文章审核</a>
                            <a th:href="@{/admin/articleList}" class="li-a-a" target="iframe">文章管理</a>
                            <a th:href="@{/admin/courseList}" class="li-a-a" target="iframe">课程管理</a>
                            <a th:href="@{/admin/noticeList}" class="li-a-a" target="iframe">公告管理</a>
                        </div>
                    </li>

                </ul>
            </div>
        </div>
    </div>
    <div class="nav-right">
        <div class="nav-top">
            <a class="btn btn-danger" th:if="${session.admin!=null}" th:href="@{/admin/logout}">退出后台</a>
        </div>
        <div class="content-page">
            <iframe name="iframe" width="100%" height="100%" frameborder="0"
                    th:src="@{/admin/adminIndex}"></iframe>
        </div>
    </div>
</div>

<script type="text/javascript" th:src="@{/admin/js/jquery.min.js}"></script>
<script type="text/javascript">
    $(function() {
        let navflag = false;
        $('.nav-tab').click(function() {
            $(this).siblings().each(function() {
                $(this).removeClass('a_active');
                // $(this).removeClass('a_active');
                $(this).find('.nav-box').css('height', '0')
                //关闭右侧箭头
                if ($(this).attr('class').indexOf('nav-ul') != -1) {
                    $(this).find('.bx-chevron-right').css('transform', 'rotateZ(0deg)')
                    $(this).find('.bx-chevron-right').css('transition', 'all .5s')
                    $(this).removeClass('nav-show')
                }
            })
            //当前选中
            $(this).addClass('a_active')
            $(this).find('.li-a').addClass('active')
            // 打开右侧箭头
            $(this).find('.bx-chevron-right').css('transform', 'rotateZ(90deg)')
            $(this).find('.bx-chevron-right').css('transition', 'all .5s')
            $(this).addClass('nav-show')
            // $(this).find('div').addClass('nav-box')
        })
        /* 二级菜单a点击事件 */
        $(".li-a-a").click(function() {
            $(".li-a-a").each(function() {
                $(this).removeClass('active-li-a');
            })
            $(this).addClass('active-li-a');
        })
    })

</script>
</body>
</html>
